﻿@charset "utf-8";
.aboutus {height:auto;margin:25px auto;height:auto;}
.aboutus .aboutus-img-box {width:51.5%;float:left;background:url(../images/about.jpg) center top no-repeat  rgb(235,235,235);background-size:100% 100%;height:416px;}
.aboutus .aboutus-img-box img {margin:80px 0 0 0;width:52.75%;height:245px;border:solid 1px #fff;float:right;box-shadow:0 0 10px #111;}
.aboutus .about-con {width:48.5%;float:left;background:#ccc;height:416px;}
.aboutus .about-con .inner {width:82.8%;height:245px;margin:80px 0 0 0;float:left;background:#fff;border:solid 1px #fff;box-shadow:0 0 10px #111;}
.aboutus .about-con .inner .con {padding:20px 20px 20px 30px;overflow:hidden;}
.aboutus .about-con .inner .con .tlt {width:100%;}
.aboutus .about-con .inner .con .tlt .tlt-h {width:150px;font-weight:400;margin:5px 10px 20px 0;border-right:solid 2px #333;height:32px;line-height:32px;float:left;letter-spacing:0.1em;}
.aboutus .about-con .inner .con  .tlt .tlt-en {font-weight:100;font-size:20px;text-transform:Uppercase;margin:12px 0 0 10px;float:left;color:#333;}
.aboutus .about-con .inner .con p {color:#333;line-height:18px;width:100%;}
@media screen and (max-width:768px) {.ser-can .w98 .ser,.ser-can .w98  .can,.aboutus .aboutus-img-box,.ser-can .link,.aboutus .about-con {width:98%;height:auto;margin:5px 1%}
.ser-can .link a {font-size:12px;color:#333;}
.aboutus .aboutus-img-box img {margin:80px  10%;width:80%;height:auto;float:none;}
.aboutus .about-con .inner {width:94%;height:auto;margin:30px 3%;float:none;}
}
.products {background:#f3f3f3;padding:30px 0 20px 0;height:auto;}
.h-tlt {text-align:center;position:relative;}

.h-tlt .h-tlt-inner {display:inline-block;_zoom:1;_display:inline;text-align:center; background:url(../images/tit_bg.png) center no-repeat; padding:10px 25px;position:relative;z-index:3;left:14px;top:2px;width:190px;}
.h-tlt .h-tlt-inner h2 {font-size:30px;font-weight:400;letter-spacing:0.2em;margin:0;}
.h-tlt .h-tlt-inner .tlt-en {font-weight:100;font-size:16px;text-transform:Uppercase;margin:0px;color:#333;line-height:20px;}
.h-tlt p.line {position:absolute;bottom:30px;width:100%; z-index:2;}
.tlt-ad {text-align:center;margin:10px auto;color:#000;text-indent:2em;}
/* Tab切换 */
.ProductsBox {float:right;width:100%;height:auto;overflow:hidden;padding:10px;}
.ProductsBox .hd {width:23%;min-width:275px;float:left;font-size:14px;margin:0 1% 0 0;height:auto;line-height:52px;}
.ProductsBox .hd ul {overflow:hidden;zoom:1;}
.ProductsBox .hd ul li {width:99%;margin:10px .5%;}
.ProductsBox .hd ul li a {cursor: pointer;  background: #99ccff url(../images/parrow.png) no-repeat 98% center;  margin-top: 8px;margin-bottom: 0px;padding-left:15px;color:#333;}
 
.ProductsBox .hd ul li.on a {background: #003366 url(../images/parrowon.png) no-repeat 98% center;color:#fff; }
.ProductsBox .bd {width:75%;padding:10px 0.5%;height:auto;float:left;}
.pro-list {width:100%;overflow:hidden;position:relative;}
.pro-list li {width:24%;margin:10px 0.5%;float:left;}
.pro-li-inner {width:100%;float:left;height:auto;overflow:hidden;position:relative;}
.pro-li-inner img {display:block;width:100%;height:auto;}
.products  .pro-inner li:nth-child(n+1):hover figcaption {bottom:0;}
.pro-li-inner figcaption {display:block;padding:10px  20px;position:absolute;left:0;bottom:-300px;transition:320ms ease-in-out;box-sizing:border-box;width:100%;height:161px;background:url(../images/pic_bg.png) repeat left top;}
.pro-li-inner figcaption h4 a {font-weight:normal;line-height:normal;color:#fff;font-size:1.5em;padding-bottom:10px;border-bottom:1px solid #fff;}
.pro-li-inner figcaption p{line-height:16px;height:64px;overflow:hidden;font-size:12px;color:#fff;}
.pro-li-inner figcaption a.more {color:#fff;font-size:1.0em;}
.pro-li-inner figcaption a.more {float:right;border:1px solid #00b4ff;color:#00b4ff;display:block;font-size:14px;margin-top:10px;width:120px;text-align:center;}
.products  .pro-inner li .pro-list-h3{line-height:40px;background:#fff;text-align:center;}


.app {width:100%;height:auto;margin:60px auto;overflow:hidden;}
 
.app-li-inner ul {margin:40px auto;}
.app-li-list {margin-top:50px;overflow:hidden;width:100%;height:auto;}
.app-li-list li {width:24%;margin:10px 0.5%;float:left;}
.app-li-inner {width:100%;float:left;height:auto;overflow:hidden;position:relative;}
.app-li-inner img {display:block;width:100%;height:auto;}
/*.app .app-inner li:nth-child(n+1):hover figcaption {bottom:0;}*/
.app-li-inner figcaption {display:block;padding:10px  20px;position:absolute;left:0;bottom:-300px;transition:320ms ease-in-out;box-sizing:border-box;width:100%;height:215px;background:url(../images/pic_bg.png) repeat left top;}
.app-li-inner figcaption h3 a {font-weight:normal;line-height:normal;color:#fff;font-size:1.5em;padding-bottom:20px;border-bottom:1px solid #fff;}
.app-li-inner figcaption p,.app-li-inner figcaption a.more {color:#fff;font-size:1.0em;}
.app-li-inner figcaption a.more {float:right;border:1px solid #00b4ff;color:#00b4ff;display:block;font-size:14px;margin-top:20px;width:120px;text-align:center;}
.app .app-inner li .app-list-h3{line-height:80px;background:#f3f3f3;text-align:center;}

.par {width:100%;height:auto;margin:60px auto;overflow:hidden;background: #f3f3f3;}
 
.par-li-inner ul {margin:40px auto;}
.par-li-list {margin-top:50px;overflow:hidden;width:100%;height:auto;}
.par-li-list li {width:10.5%;margin:10px 1%;float:left;}
.par-li-inner {width:100%;float:left;height:auto;overflow:hidden;position:relative;}
.par-li-inner img {display:block;width:100%;height:auto;}
.par .par-inner li:nth-child(n+1):hover figcaption {bottom:0;}
.par .par-inner li .par-list-h3{line-height:30px;background:#fff;text-align:center;}
 
@media screen and (max-width:768px) {.banner {margin-top:70px;}
.aboutus-inner .about-con-768 {display:block;color:#fff;width:80%;height:580px;background:#CC3333;margin:20px 5%;padding:10px 5%;}
.products {margin:40px auto;}
.products li ,.app-li-list li {width:48%;margin:10px 1%;float:left;}
.ProductsBox {float:none;padding:0px;}
.ProductsBox .hd {width:96%;min-width:96%;padding:0 2%;font-size:14px;margin:auto;height:auto;line-height:52px;}
.ProductsBox .hd ul li {width:47%;margin:5px 1.5%;float:left;text-align:center;}
.ProductsBox .bd {width:99%;}
.par-li-list li {width:24%;margin:10px 0.5%;float:left;}
.app-li-list li {width:99%;margin:10px 0.5%;float:left;}
}
.news {padding:40px 0 10px 0;position:relative;}
.NewsBox {float:right;width:100%;height:auto;overflow:hidden;padding:10px;}
.NewsBox .hd {width:40%;min-width:438px;padding:0 15px;font-size:14px;margin:auto;height:52px;line-height:52px;}
.NewsBox .hd ul {overflow:hidden;zoom:1;}
.NewsBox .hd ul li {width:23.333333%;margin:0 5%;float:left;text-align:center;}
.NewsBox .hd ul li a {display:block;padding:0 15px;background:#fff;border-radius:10px;border:solid 1px #333;}
.NewsBox .hd ul li a:hover {background:#39A4DC;text-decoration:none;border:solid 1px #39A4DC;border-radius:10px;}
.NewsBox .hd ul li.on a {background:#39A4DC;color:#fff;font-weight:bold;border:solid 1px #39A4DC;border-radius:10px;}
.NewsBox .bd {padding:10px;height:auto;margin:30px auto;}
.news-inner {margin:20px 0;height:375px}
.news-inner .pic-news .data{width:63px;border-right: solid 1px  #39A4DC;text-align:center;float:left;}
.news-inner .pic-news  .data .day{font-size:45px;font-weight:700;padding:5px 0 0 0;line-height:45px;}
.news-inner .pic-news  .data .yy-mm{font-size:14px;font-weight:200;line-height:20px;}
.news-inner .pic-news  .con{width:400px;float:left;margin:5px 0 0 15px;}
.news-inner .pic-news  .con .tlt{font-size:16px;font-weight:500;line-height:20px;height:20px;overflow:hidden;}
.news-inner .pic-news  .con p{font-size:12px;line-height:16px;height:32px;overflow:hidden;}
.news-inner .pic-news {width:44.75%;height:auto;float:left;position:relative;}
.news-inner .pic-news img {width:100%;height:auto;}
.news-inner .pic-news .figcaption {display:block;padding:5px 10px;position:absolute;left:0;bottom:0px;box-sizing:border-box;width:100%;height:80px;background:url(../images/pic_bg.png) repeat left top;}

.news-inner .pic-news  a {color:#fff;}
.newslist a {color:#00b4ff;font-size:14px;font-weight:500;}
.news-inner .newslist  a:hover {color:#003366;}
.news-inner .newslist {width:auto;max-width:600px;float:right;margin:0 0 0 30px;}
.news-inner .newslist li {width:100%;height:115px;float:left;overflow:hidden;margin:0 0 10px 0;border-bottom:solid 1px #ddd;}
.news-inner .newslist li img {width:auto;height:80%;float:left;padding:5px 0;}
.news-inner .newslist li .figcaption {float:left;max-width:70%;margin:0 0 0 20px;}
.news-inner .newslist li .figcaption h4{height:25px; line-height:25px;overflow:hidden;}
.news-inner .newslist li .figcaption p {line-height:15px;height:45px;overflow:hidden;color:#171717;font-size:.8em;}
@media screen and (max-width:1100px) {
.news-inner .pic-news  .con{width:300px;}
.news-inner .pic-news img {width:100%;height:auto;}
.news-inner .newslist {width:52%;max-width:700px;float:left;margin:0 0 0 2%;}
.news-inner {margin:20px 0;height:270px}
.news-inner .newslist li {width:100%;height:90px;float:left;overflow:hidden;margin:0 0 5px 0;border-bottom:solid 1px #ddd;}
}
@media screen and (max-width:1024px) {.news-inner .pic-news  .con{width:280px;}}
@media screen and (max-width:768px) {
.NewsBox {float:right;width:100%;height:auto;overflow:hidden;padding:0px;}
.NewsBox .hd {width:96%;min-width:96%;padding:0;margin:0 2%;}
.NewsBox .hd ul li {width:29.333333%;margin:0 2%;float:left;text-align:center;}.news-inner .pic-news {width:40%;height:auto;float:left;position:relative;left:0;}
	.news-inner .pic-news  .con{width:180px;}
	.news-inner .newslist li:nth-child(3){display:none;}
	.news-inner .newslist li .figcaption {float:right;max-width:60%;font-size:.6em;margin:0 0 0 10px;}
	}
@media screen and (max-width:720px) {	.news-inner .pic-news  .con{width:160px;}}	
@media screen and (max-width:640px) {.newslist a {color:#CC3333;height:28px;overflow:hidden;}
.news-inner .pic-news {width:80%;height:auto;float:none;margin:10px 10%;}
.news-inner .newslist {width:80%;max-width:700px;float:left;margin:0 10%;}
	.news-inner .pic-news  .con{width:70%;}
		.news-inner .newslist li:nth-child(3){display:block;}
.news-inner .newslist li .figcaption {float:right;max-width:60%;font-size:.6em}
}
@media screen and (max-width:480px) {.newslist a {color:#CC3333;height:28px;overflow:hidden;}
.news-inner .pic-news {width:80%;height:auto;float:none;margin:10px 10%;}
.news-inner .newslist {width:80%;max-width:700px;float:left;margin:0 10%;}
.news-inner .newslist li .figcaption  {float:right;max-width:50%;font-size:.6em}
	.news-inner .pic-news  .con{width:60%;} 
}